<template>
  <div v-show="item.isShow" :class="['f pt10 pb10', item.labelAlign]">
    <div
      :class="['nowrap mr10 tr', item.required ? 'need' : '']"
      :style="{
        width: item.isLabelWidth ? item.labelWidth + 'px' : 'auto',
      }"
    >
      {{item.label}}
    </div>
    <div :class="['f1 rel', item.errmsg ? '' : '']">
      <div class="f ac rw">
        <div @click="item.disabled ? '' : selectItem(optItem)" v-for="optItem in item.options" :key="optItem.id" :class="['f ac mr30 poi', item.disabled ? 'disabled' : '']">
          <div
            :class="['rds50 f ac xc mr5 trans3']"
            :style="{
              width:'16px',
              height:'16px',
              border: item.errmsg ? '1px solid #ff0000' : optItem.isChecked ? '1px solid #1aada7' : '1px solid #dcdee2',
            }"
          >
            <div v-show="optItem.isChecked" class="rds50" :style="{ transform:'translateX(0.2px)',width:'10px',height:'10px',background: '#1aada7'}"></div>
          </div>
          <div class="nowrap">{{optItem.name}}</div>
          <Input v-if="optItem.isNeedOther" :value="optItem.value2" @on-change="e => changeValue2(e, optItem)" class="ml10" style="width:200px;" placeholder="请输入" :disabled="!optItem.isChecked"></Input>
        </div>
      </div>
      <div class="abs l0 gred" v-if="item.errmsg" style="bottom:-20px;">{{item.errmsg}}</div>
    </div>
  </div>
</template>
<script src='./index.js'></script>
<style src='./index.css' scoped>
</style>